<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>用户登陆--国科环宇科技</title>
<link rel="shortcut icon" href="image/favicon0.ico" type="image/x-icon" />
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
<script type="text/javascript" src="bootstrap/js/jquery-3.2.1.min.js"></script>
<style type="text/css">
	html,body {
		height: 100%;
		margin: auto,0px;
	}
	.title-bar{
		height: 65px;
		position:relative;
		width:98%;
		margin:0 auto;
		padding-top:0.8%;
	}
	.bottom-bar{
		position:absolute;
		width:100%;
		margin:2% auto 0;
		text-align:center;
	}
	.container{
		width:100%;
		height:85%;
		overflow:auto;
		box-shadow: 0px 0px 2px #EDEDED inset;
		background-image:url(image/login-3.jpg);
		background-size:auto;
		background-repeat:no-repeat;
		-webkit-filter: contrast(1.2);
		filter: brightness(1.05) contrast(1.1) saturate(1.1);
	}
	.login-center{
		position:relative;
		width: 30%;
		height:100%;
		left:57%;
		border:2px solid #EDEDED;
		border-top:1px solid #EDEDED;
		background-color:rgba(250,250,250,0.2);
		box-shadow: 0px 0px 2px #EDEDED inset;
	}
	.loginForm{
		position:absolute;
		top:50%;
		width: 100%;
		height:40%;
		margin-top:-25%;
		border-radius:8px 60px 8px 60px;
		background-color:rgba(105,105,105,0.6);
		box-shadow: 0px 0px 5px #E0FFFF inset;
	}
	.loginForm label{
		font-size: 20px;
		padding-right: 1px;
		color: #FFFFF0;
	}
	.loginForm input{
		font-size: 18px;
		height: 40px;
		margin-bottom: 10px;
		border: 1px solid #8B8378;
	}
	.loginBtn{
		display: inline-block;
		text-align:center;
		width:100%;
		height: 40px;
		line-height:40px;
		font-size:20px;
		border-radius:10px;
		color:white;
		background-color:rgba(74,112,139,0.95);
		box-shadow: 0px 0px 10px #87CEFA inset;
	}
	.loginBtn:hover{
		text-decoration: none;
		color:white;
		cursor:pointer;
	}
	.formTitle{
		font-size: 30px;
		padding-bottom: 15px;
		padding-top: 12px;
		text-align:center;
		color: #FFFFFF;
	}
	.title-bar a{
		display: inline-block;
		float:right;
		width: 110px;
		text-decoration:none;
		font-size: 15px;
		border-radius:8px;
		background-color:rgba(74,112,139,0.4);
		height: 35px;
		line-height: 35px;
		text-align: center;
		margin-left:10px; 
		color: white;
	}
	.title-bar a:hover{
		cursor:pointer;
		font-size:18px;
	}
	hr{
		border-top:1px solid #212121;
	}
	.registerBtn{
		margin-top:10px;
		text-align: center;
	}
	.registerBtn a:hover{
		cursor: pointer;
		text-decoration:none;
		font-size:18px;
	}
	.shade{
		position:absolute;
		display: none;
		top:0px;
		height: 100%;
		width: 100%;
		background-color: rgba(0,0,0,0.5);
	}
	.registerPanel{
		position:absolute;
		display: none;
		top:15%;
		left:35%;
		height: 70%;
		width:30%;
		border-radius:5px;
		background-color:white;
	}
	.a-btn{
		display:inline-block;
		text-align:center;
		font-size: 20px;
		cursor: pointer;
		height:45px;
		line-height:45px;
		width:130px;
		border-radius:8px;
	}
	.registerClose{
		text-align: right;
		height:50px;
		border-bottom: 1px solid;
	}
	.registerClose a{
		text-decoration:none;
		padding: 4px 15px 45px 0px;
	}
	.registerForm{
		height:81%;
		background-color: #E8E8E8;
	}
	.registerDone{
		position:relative;
		top:3%;
		text-align: center;
	}
	.registerDone .a-btn{
		color:white;
		height:35px;
		line-height:35px;
		text-decoration: none;
		background-color:rgba(74,112,139,0.75);
		box-shadow: 0px 0px 60px #87CEFA inset;
	}
</style>
</head>
<body>
	<div class = 'title-bar'>
		<img alt="" src="logo/logo.jpg"  height="45"/>
		<span style="font-size: 18px;">北京国科环宇空间技术有限公司</span>
		<a>加入我们</a>
		<a>联系我们</a>
		<a>产品展示</a>
		<a>进入首页</a>
	</div>
	<div class='container'>
		<div class = 'login-center'>
			<div class='loginForm'>
				<form class="form-horizontal" role="form" id='loginForm'>
					<div class="form-group" >
						<div class="col-sm-12 formTitle">
							<span>用户登陆</span>
						</div>
					</div>
					<div class="form-group">
					    <label class="col-sm-3 control-label">账&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号:</label>
					    <div class="col-sm-7">
					      <input type="text" name='userCode' class="form-control" id="firstname" placeholder="请输入账号" />
					    </div>
				  	</div>
				  	<div class="form-group">
					    <label class="col-sm-3 control-label">密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码:</label>
					    <div class="col-sm-7">
					      <input type="password" name='password' class="form-control" id="lastname" placeholder="请输入密码" />
					    </div>
				  	</div>
				  	<div class="form-group">
					    <div class="col-sm-offset-3 col-sm-7">
					    	<span id='LoginErrorMsg' style="color: red;"></span>
					    	<a class='loginBtn' id ='loginBtn' onclick="login()">登录</a>
					    </div>
					    <div class="col-sm-offset-2 col-sm-8 registerBtn">
					    	<span>没有账号？</span><a onclick="openRegisterPage()" style="color: #104E8B;">马上注册</a>
					    </div>
				  	</div>
				</form>
			</div>
		</div>
	</div>
	<div class='bottom-bar'>
		<span>© 2014 北京国科环宇空间技术有限公司. 京ICP备05035332号-1 京公网安备11010802014974号 站长统计</span>
	</div>
	
	
	
	<div class='shade'></div>
	<div class='registerPanel'>
		<div class='registerClose'><a class = 'a-btn' onclick="closeRegister()">关闭页面</a></div>
		<form action="" class='form-horizontal registerForm role="form"'>
				<div class="form-group" >
					<div class="col-sm-12 formTitle">
						<span>用户注册</span>
					</div>
				</div>
				<div class="form-group">
				    <label class="col-sm-3 control-label">账&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号:</label>
				    <div class="col-sm-7">
				      <input type="text" class="form-control" placeholder="请输入账号" />
				    </div>
			  	</div>
			  	<div class="form-group">
				    <label class="col-sm-3 control-label">密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码:</label>
				    <div class="col-sm-7">
				      <input type="text" class="form-control" placeholder="请输入密码" />
				    </div>
			  	</div>
			  	<div class="form-group">
				    <label class="col-sm-3 control-label">确认密码:</label>
				    <div class="col-sm-7">
				      <input type="text" class="form-control" placeholder="请输入密码" />
				    </div>
			  	</div>
		</form>
		<div class='registerDone'>
			<a class='a-btn'>完成</a>
		</div>
	</div>
</body>
<script type="text/javascript">
/*<![CDATA[*/
	function clock(){
		var date = new Date();
		var year = date.getFullYear();
		var month = (date.getMonth() + 1)<10?"0"+(date.getMonth() + 1):date.getMonth() + 1;
		var day = date.getDate()<10?"0"+date.getDate():date.getDate();
		var hour = date.getHours()<10?"0"+date.getHours():date.getHours();
		var minute = date.getMinutes()<10?"0"+date.getMinutes():date.getMinutes();
		var second = date.getSeconds()< 10?'0'+date.getSeconds():date.getSeconds();
		var currentTime = year+'-'+month+'-'+day+' '+hour+':'+minute+':'+second;
		document.getElementById("systemTime").innerHTML=currentTime;
    }
    function closeRegister(){
    	$(".registerPanel").css({ display: "none"});
    	$(".shade").css({ display: "none"});
    	$(".registerForm")[0].reset();
    }
    function openRegisterPage(){
    	$(".registerPanel").css({ display: "block"});
    	$(".shade").css({ display: "block"});
    }
    function login(){
    	$.ajax({
 		   type: "POST",
 		   url: "login.do",
 		   data: $("#loginForm").serialize(),
 		   success: function(msg){
 		     if(msg.success){
 		    	 window.location.href='/lxi-list.do';
 		     }else{
 		    	 $("#LoginErrorMsg").html('用户名或密码错误，请重新输入...');
 		     }
 		   }
 		});
    }
    $(window).keydown(function(event){
		switch(event.keyCode) {
		 case 13:
			 $("#loginBtn").click();
			 break;
		 case 8:
			 break;
		 default:
		}
	});
/*]]>*/
</script>
</html>